
<template>
    <div class="home"> 
        <img class="bg" src="../assets/bg2.png">
        <div class="title" >搬家预约系统</div>
        <PikaVue style="z-index: 10;"/>
         <LoginVue style="z-index: 10;" />
    </div>

</template>
<script setup>
import PikaVue from '../components/Pika.vue';
import LoginVue from './Login.vue';


</script>

<style scoped lang="less">

.home{
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    // background-color: darkcyan;
    background-image: linear-gradient( 135deg, #ABDCFF 10%, #0396FF 100%);
   

    .bg{

        position: absolute;
        // object-fit: cover;
        height: 90%;
        z-index: 1;
        width: 100%;
        top: 10%;
        right: 0;
        transform:rotateY(180deg);
    }

    .title{
        text-align: center;
        color: deepskyblue;
        font-size: 48px;
        text-shadow:  2px 2px 2px #000;
    }
}
</style>